<div class="Layer cover">
  <div class=" whiteList" >
    <h2 class="text-title" >{{whiteIpText == true ? "白名单IP":"黑名单IP"}}</h2><span class="cursor  closeBtn" ng-click="close()"><i class="iconfont bigSize">&#xe608;</i></span>

    <form id='addIpList' class="main">
      <i class="titleList">*多IP换行分隔，每行一个</i>
      <div class="textIpList clear">
        <div class="fl " ng-show="whiteIpText">
          <textarea type="text" name='whiteList' ng-model="whiteList" ng-keyup="keyUpWhite($event)"></textarea>
        </div>
        <div class="fl " ng-show="blackIpText">
          <textarea type="text" name='blackList' ng-model="blackList" ng-keyup="keyUpBlack($event)"></textarea>
        </div>
      </div>
      <!--<div class="button">-->
        <!--<button type='button' class="cancle" ng-click="close()">取消</button>-->
        <!--<button class="submit" ng-click="addIpList()">确认</button>-->
      <!--</div>-->
      <div class="btnContainer">
        <button ng-click="close()">取消</button>
        <button ng-click="addIpList()">确定</button>
      </div>
    </form>
  </div>
</div>
<style>
  .Layer .layerBody{
    background: #fff;
    border-radius: 8px;
    box-sizing: border-box;
    padding: 30px 30px 60px 30px;
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
  }
  .Layer .layerBody .textTitle{
    margin-top: 0px;
  }
  .Layer .closeLayer{
    width:20px;
    height:28px;
    position:absolute;
    right:30px;
    top:30px;
    cursor: pointer;
  }
  .Layer .quickChoose{
    width:100%;
    height:42px;
    line-height: 42px;
    background-color: #f4f4f4;
  }
  .Layer .fCheckBox{
    width:140px;
    margin-right:40px;
    margin-bottom: 0px;
    padding:0px;
  }
  .Layer .fCheckBox.spaceBefore{
    margin-left:10px;
    margin-right: 0px;
  }
  .Layer .everyday{
    margin-top:20px;
  }
  .Layer .everyday span{
    width:20px;
    height:20px;
    margin-right:5px;
    font-size: 14px;
    color:#393d40;
    line-height: 20px;
    text-align: center;
    background-color: #f4f4f4;
    border-radius: 3px;
    cursor: pointer;
  }
  .Layer .everyday span.spaceRight{
    margin-right:40px;
  }
  .Layer .everyday span.chosedState{
    color:#ffffff;
    background-color: #ff7070;
  }
  .Layer .btns{
    width:340px;
    margin-top: 60px;
    position: relative;
    left:50%;
    transform: translateX(-50%);
  }
  .content .whiteList{
    width: 700px;
    height:715px;
    padding:30px 30px 60px;


    background: #fff;
    border-radius: 8px;
    box-sizing: border-box;
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
  }
  .content .whiteList .closeBtn{
    right: 30px;
    top:30px;
    color:#FFB135;
    position: absolute;
  }
  .content .whiteList .text-title{
    padding:0 0 0 15px;
    font-size:20px;
    color:#393d40;
  }
  .content .whiteList .titleList{
    padding-top:30px;
    color:#b3b3b3;
    font-size:18px;
  }
  .content .whiteList textarea{
    width: 640px;
    height:436px;
    padding:10px 20px 20px;
    font-size:16px;
    color:#393d40;
    border:1px solid #d3d3d3;
    line-height:36px;
  }
  .content .whiteList .textIpList{
    margin:20px 0 50px;
  }
</style>